@import '../global/variables.css';

.alertContainer {
  position: fixed;
  z-index: var(--ring-alert-z-index);
  right: calc(var(--ring-unit) * 2);
  bottom: calc(var(--ring-unit));

  display: flex;
  overflow: visible;
  align-items: flex-end;
  flex-direction: column;

  max-height: calc(100vh - 2 * var(--ring-unit));

  pointer-events: none;

  font-family: var(--ring-font-family);
  font-size: var(--ring-font-size);
}

.alertInContainer {
  composes: alert from './alert.css';

  overflow-y: auto;

  min-width: calc(var(--ring-unit) * 30);
  max-width: calc(var(--ring-unit) * 50);
  margin-top: 0;
}
